<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
 <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<jsp:include page="/WEB-INF/pages/qtop.jsp" flush="true"></jsp:include>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>在线问答系统</title>
<script type="text/javascript">
 	//修改密码
 	function updatePwd(){
 		var checkPwd=$("#pwdcheck").val();//原密码
 		var newPwd=$("#newPwd").val();//新密码
 		var newRepwd=$("#newRepwd").val();//确认新密码
 		var check= /(?!^\d+$)(?!^[a-z,A-Z]+$)[0-9,a-z,A-Z]{6,20}/;
 		if(newPwd==newRepwd&&check.test(newPwd)==true){
 			$.ajax({
    		  	cache : true,
 				type : "POST",
 				url : "<c:url value='/login/updatepwd/${sessionScope.user.uId}'/>",
 				data :{"newpwd":$('#newPwd').val(),"pwdcheck":$('#pwdcheck').val()},
 				error : function(
 						request){
 					return;
 				},
 				success : function(data){
 					if(data=="0"){
 						window.location.href=window.location.href;
 					}else if(data=="1"){
 						alert("输入的原密码不正确！请重新输入");	
 					}
 				}
    	  });
 		}
 		else{
 			if(checkPwd==""){
 				$("#checkpwdSpan").html('原密码不能为空');
 			}
 			if(newPwd==""){
 				$("#updatePwdSpan").html('新密码不能为空');
 			}
 			if(newRepwd==""){
 				$("#updateRepwdSpan").html('确认密码不能为空');
 			}
 			if(newPwd!=newRepwd){
 				$("#updateRepwdSpan").html('两次密码输入不匹配');
 			}
 			if(check.test(newPwd)==false){
 				$("#updatePwdSpan").html('密码长度必须是6-20位(不能是全字母或全数字)');
 			}
 		}
 	}
    //保存修改信息
    function saveInfo(obj){
    	$("#save").hide();
		$("#edit").show();
		//将输入框变成不可更改的状态
		$("#uname").attr("readonly",true);
		$("#uphone").attr("readonly",true);
		if(check.test(phone)==true){
	    	$.ajax({
	    		  	cache : true,
	 				type : "POST",
	 				url : "<c:url value='/login/updateinfo/${sessionScope.user.uId}'/>",
	 				data :{"uName":$('#uname').val(),"uPhone":$('#uphone').val()},
	 				error : function(
	 						request){
	 					return;
	 				},
	 				success : function(data){
	 					if(data=="0"){
	 						window.location.href=window.location.href;
	 					}else if(data=="1"){
	 						alert("昵称不能为空");
	 						window.location.href=window.location.href;
	 					}else if(data=="2"){
	 						alert("手机号码不能为空");
	 						window.location.href=window.location.href;
	 					}
	 				}
	    	  });
		}else{
			 $("#phoneSpan").html('手机输入格式有误');
			 if(phone==""){
				 $("#phoneSpan").html('手机号码不能为空');
			 }
		}
    }
    
    function deletecollect(obj){
    	if(confirm('您确定要删除收藏的这个问题吗?')==true){
    		$.ajax({
    		  	cache : true,
 				type : "POST",
 				data:{"cId":obj},
 				url : "<c:url value='/ques/deletecollect'/>",
 				error : function(
 						request){
 					return;
 				},
 				success : function(data){
 				}
    	  });
    		return true;
    	}else{
    		return false;
    	}
    	
    }
    function deletequestion(obj){
    	if(confirm('您确定要删除您提过的这个问题吗?')==true){
    		$.ajax({
    		  	cache : true,
 				type : "POST",
 				data:{"qId":obj},
 				url : "<c:url value='/ques/deletequestion'/>",
 				error : function(
 						request){
 					return;
 				},
 				success : function(data){
 				}
    	  });
    		return true;
    	}else{
    		return false;
    	}
    }
    jQuery(document).ready(
    		function($) {
    			$('.imgLoad').click(
    					function(){
    					$('.theme-popover-mask2').fadeIn(100);
    					$('.theme-popover2').slideDown(200);
    					})
    			$('.updatePwd').click(
    					function(){
    					$('.theme-popover-mask').fadeIn(100);
    					$('.theme-popover').slideDown(200);
    					})
    			$('.theme-poptit .close').click(function(){
    					$('.theme-popover-mask2').fadeOut(100);
    					$('.theme-popover2').slideUp(200);
    					$('.theme-popover-mask').fadeOut(100);
    					$('.theme-popover').slideUp(200);
    		})
    		$("#edit").click(function(){
    			$("#edit").hide();
    			$("#save").show();
    	    	$("#uname").removeAttr("readonly");
    	    	$("#uphone").removeAttr("readonly");
    		})
    		
    	})
  </script>
</head>
<body>
	 ﻿<div  style="padding: 0px 500px 10px 400px">
    	<div class="main center">
			<ul id="myTab" class="nav nav-tabs">
				<li class="active">
					<a href="#info" data-toggle="tab" onclick="info()">
					个人信息
					</a>
				</li>
				<li>
					<a href="#myquestion" data-toggle="tab" onclick="tgques()">我发布的问题
					</a>
				</li>
				<li class="dropdown">
					<a href="#collect"  data-toggle="tab">我的收藏
					</a> 
				</li>
				<li >
					<a href="#myanswer"  data-toggle="tab">我的回答
					</a> 
				</li>
			</ul>
<!-- <div class="pop-tip hide">
    <div class="pop-tip-area">
        <p class="pop-tip-txt">修改成功</p>
    </div>
</div> -->

<!-- 用户信息显示 -->
		<div id="myTabContent" class="tab-content" style="padding: 0px 0px 0px 60px">
        	<div class="tab-pane fade in active" id="info">
             <div class="container">
                <h2>基本信息 
                <span id="edit_info">
                <a href="javascript: updateInfo(1);" id="edit" style="font-size: 10px;padding: 0px 0px 0px 20px;color: green;">	
                	编辑</a>
                <a href="javascript: saveInfo(this);" id="save" style="display: none;font-size: 10px;padding: 0px 0px 0px 20px;color: green;">
                	保存</a></span></h2>
                
                 <ul class="infos">
                 <li>账号</li>
                    <li class="right_info" style="margin-left: 30px;">
                        <span>${user.uEmail}</span>
                    </li>
                  </ul>
                  <ul class="infos">
                    <li >昵称</li>
                    <li>
                        <input type="text" style="margin-left: 30px;"
                        		readonly="readonly" id="uname"
                        	    value="${user.uName}" /></li>
                </ul>
                <ul class="infos">
                    <li >手机</li>
                    <li>
                    <input type="text" style="margin-left: 30px;"
                        		readonly="readonly" id="uphone"
                        	    value="${user.uPhone}" /><span id="phoneSpan" style="color: red;"></span></li>
                </ul>
            </div>
           
            <div > 
            <table>
            	<tr><td style="padding: 0px 0px 0px 120px">
            		 <a href="javascript:;" style="font-size: 17px;" class="btn btn-default updatePwd">修改密码</a>
            		</td>
            	</tr>
            </table>		
            </div>
        </div>

<!-- 我发布的问题 -->
   	<div class="tab-pane fade" id="myquestion">
                      <div class="container">           
      <table class="table"  style="width:70% height:20px ">
	      <c:forEach items="${questions}" var="ques" varStatus="st">
			<tr>
			  <td class="col-md-8">
				<dl>
				  <dt>
				  	<a href="" style="color: #0ccccc;font-size: 8px;"><fmt:formatDate value="${ques.qApplytime}" pattern="yyyy-MM-dd HH:mm:ss"/>提问</a>
				  </dt>
				  <dd>
				  		<a href="${path}/ques/answerques/${ques.qId}" style="font-size: 24px;font-weight: bold;">${ques.qTitle}</a>&nbsp;&nbsp;&nbsp;&nbsp;
				  		<a href="" style="color: red;font-size: 8px;" onclick="deletequestion(${ques.qId});">删除</a>
				  </dd>
				</dl>
			  </td>
			</tr>
		  </c:forEach>
	  </table>
	</div>
      </div>  
      
 <!-- 我的收藏 -->
<div class="tab-pane fade" id="collect">
       <div class="container">           
	      <table class="table"  style="width:70% height:20px ">
		      <c:forEach items="${collects}" var="collect" varStatus="st">
				<tr>
				  <td class="col-md-8">
					<dl>
					  <dt>
					  	<a href="" style="color: #0ccccc;font-size: 8px;"><fmt:formatDate value="${collect.applytime}" pattern="yyyy-MM-dd HH:mm:ss"/>提问</a>
					  </dt>
					  <dd>
					  		<a href="${path}/ques/answerques/${collect.qId}" style="font-size: 24px;font-weight: bold;">${collect.title}</a>&nbsp;&nbsp;&nbsp;&nbsp;
					  		<a href="" style="color: red;font-size: 8px;" onclick="deletecollect(${collect.cId});">删除</a>
					  </dd>
					</dl>
				  </td>
				</tr>
			  </c:forEach>
		  </table>
		</div>
      </div>
      </div>
  </div>
 </div>
 <!-- 修改密码 -->
<div class="theme-popover"  id="updatePwd">
     <div class="theme-poptit" align="center">
          <a href="javascript:;" title="关闭" class="close">×</a>
          <h3>修改密码</h3>
     </div>
     <div class="theme-popbod dform">
           <form class="theme-signin" name="loginform"  method="post"   >
                <ol>
                     <li><strong>原密码：</strong><input id="pwdcheck" class="ipt"  type="password"   placeholder="请输入原密码"  onfocus="FocusItem(5);"/><span id="checkpwdSpan" style="color: red;"></span></li>
                     <li><strong>新密码：</strong><input id="newPwd" class="ipt" name="newpwd" type="password"   placeholder="请输入新密码"  onfocus="FocusItem(6);" /><span id="updatePwdSpan"  style="color: red;"></span></li>
                     <li><strong>确认密码：</strong><input id="newRepwd" class="ipt" name="reNewPwd" type="password"   placeholder="请确认新密码" onfocus="FocusItem(7);" /><span id="updateRepwdSpan"  style="color: red;"></span></li>
                     <li><input class="btn btn-default" type="button" name="submit" value="修改 " onclick="updatePwd();"/></li>
                </ol>
           </form>
     </div>
</div>
<div class="theme-popover-mask"></div>
</body>
<script src="${path}/include/bootstrap/js/reg.js"></script>
</html>